<template>
  <view>
    <template v-for="btnConfig in allBtnsConfig" :key="btnConfig.key">
      <GdButton
        v-if="btnConfig.isShow"
        :type="btnConfig.componentAttr.type"
        :size="btnConfig.componentAttr.size"
        @click="
          btnConfig.onClick({
            metaKey: btnConfig.key,
            containerAttr: btnConfig.containerAttr,
            metaItem: btnConfig,
          })
        "
      >
        {{ btnConfig.label }}
        <GdIcon :icon-name="btnConfig.componentAttr?.icon?.name"></GdIcon>
      </GdButton>
    </template>
  </view>
</template>
<script>
export default {
  inheritAttrs: false,
};
</script>
<script setup>
import { computed, watch, toRef, getCurrentInstance, inject } from "vue";
import GdIcon from "@gd-accbuild-ui/gd-ui/gd-icon/gd-icon.vue";
import GdButton from "@gd-accbuild-ui/gd-ui/gd-button/gd-button.vue";
import { useComputedMergeAllBtnsConfig } from "@gd-accbuild-ui/hooks/useComputedMergeAllBtnsConfig";
const curInstance = getCurrentInstance();

const props = defineProps({
  toolBarConfig: {
    type: Object,
  },
  isTreeTable: {
    type: Boolean,
    default: false,
  },
});

const emits = defineEmits(["do-operation"]);
const onClick = (params) => {
  emits("do-operation", { eventFrom: "toolbar", ...params });
};

const buildInBtnsDefaultConfig = {
  buildInAddBtn: {
    key: "buildInAddBtn",
    label: "新增",
    isShow: true,
    onClick: onClick,
    componentAttr: {
      type: "primary",
      icon: {
        site: "suffix",
        name: "plus",
      },
      size: "default",
    },
    containerAttr: {
      containerStyle: "Dialog",
      //operationType: "Add",
    },
  },
  buildInBatchDeleteBtn: {
    key: "buildInBatchDeleteBtn",
    label: "批量删除",
    isShow: true,
    beforeClickFunc: ({
      curPickedRowIds,
      tableBodyData,
      tableColMetaList,
      callback,
    }) => {
      if (curPickedRowIds.length <= 0) {
        ElMessage({
          showClose: true,
          message: "至少选择一项",
          type: "warning",
        });
        callback(new Error("至少选择一项"));
      }
    },
    onClick: onClick,
    componentAttr: {
      type: "warning",
      icon: {
        site: "suffix",
        name: "delete",
      },
      size: "default",
    },
    containerAttr: {
      containerStyle: "Tip",
      tipMesssage: "是否执行此操作!",
      buttons: [
        {
          key: "buildInContainerSubmitBtn",
          label: "执行",
          containerAttr: {
            containerStyle: "Tip",
            title: "",
            //operationType: "Add",
          },
        },
      ],
      //operationType: "Delete",
    },
  },
  buildInImportBtn: {
    key: "buildInImportBtn",
    label: "导入",
    isShow: true,
    onClick: onClick,
    componentAttr: {
      type: "primary",
      icon: {
        site: "suffix",
        name: "bottom",
      },
      size: "default",
    },
    containerAttr: {
      containerStyle: "Dialog",
      //operationType: "Import", //相当于 BatchAdd
    },
  },
  buildInExportBtn: {
    key: "buildInExportBtn",
    label: "导出",
    isShow: true,
    onClick: onClick,
    componentAttr: {
      type: "primary",
      icon: {
        site: "suffix",
        name: "top",
      },
      size: "default",
    },
    containerAttr: {
      containerStyle: "Dialog",
      //operationType: "Export",
    },
  },
  /* buildInSaveBtn: {
    key: "buildInSaveBtn",
    label: "保存",
    isShow: true,
    onClick: onClick,
    componentAttr: {
      type: "primary",
      icon: {
        site: "suffix",
        name: "save",
      },
      size:"default"
    },
    containerAttr: {
      containerStyle: "",
      operationType: "Save",
    },
  }, */
};
const allBtnsConfig = useComputedMergeAllBtnsConfig(
  toRef(props, "toolBarConfig"),
  { buildInBtnsDefaultConfig, emits },
  toRef(props, "isTreeTable")
);
defineExpose({
  allBtnsConfig,
});
</script>
